﻿<!DOCTYPE html>
<html lang="en">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>KSS Online System</title>
<link type="text/css" href="/css/style.default.css" rel="stylesheet">
<link type="text/css" href="/css/prettify.css" rel="stylesheet">
    @Styles.Render("~/Content/slick")
      <link href="/Content/StyleSheet1.css" rel="stylesheet" type="text/css" />
<script src="/js/prettify.js" type="text/javascript"></script>
  @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryui")
    <script src="/js/bootstrap.js"></script>
    <script src="/js/jquery.cookie.js"></script>
     <script src="/Scripts/drag.js" type="text/javascript"></script>
    <script src="/Scripts/drop.js" type="text/javascript"></script>
    <script src="/js/custom.js"></script>
        @Scripts.Render("~/bundles/helper")
    @Scripts.Render("~/bundles/slick")

</head>
<body>
   <div class="mainwrapper" style="background-position: 0px 0px;">
	
    <!-- START OF LEFT PANEL -->
    <div class="leftpanel" style="margin-left: 0px;">
    	
        <div class="logopanel animate0 fadeInUp">
        	<h1><a href="dashboard.html">Training managemet <span>v1.0</span></a></h1>
        </div><!--logopanel-->
        
        <div class="datewidget animate1 fadeInUp">Today is Tuesday, Dec 25, 2012 5:30pm</div>
    
    	<div class="searchwidget animate2 fadeInUp">
        	<form method="post" action="results.html">
            	<div class="input-append">
                    <input type="text" placeholder="Search here..." class="span2 search-query">
                    <button class="btn" type="submit"><span class="icon-search"></span></button>
                </div>
            </form>
        </div><!--searchwidget-->
        
       @* <div class="plainwidget animate3 fadeInUp">
        	<small>Using 16.8 GB of your 51.7 GB </small>
        	<div class="progress progress-info">
                <div style="width: 20%" class="bar"></div>
            </div>
            <small><strong>38% full</strong></small>
        </div><!--plainwidget-->*@
        
        <div class="leftmenu">        
            <ul class="nav nav-tabs nav-stacked">
            	<li class="nav-header animate4 fadeInUp">Main Navigation</li>
                <li class="active animate5 fadeInUp"><a href="form"><span class="icon-align-justify"></span> KSS Forms</a></li>
              @*  <li class="animate6 fadeInUp"><a href="media.html"><span class="icon-picture"></span> Media</a></li>
                <li class="dropdown animate7 fadeInUp"><a href=""><span class="icon-briefcase"></span> UI Elements &amp; Widgets</a>
                	<ul>
                    	<li><a href="elements.html">Theme Components</a></li>
                        <li><a href="bootstrap.html">Bootstrap Components</a></li>
                    </ul>
                </li>
                <li class="dropdown animate8 fadeInUp"><a href=""><span class="icon-th-list"></span> Tables</a>
                	<ul>
                    	<li><a href="table-static.html">Static Table</a></li>
                        <li><a href="table-dynamic.html">Dynamic Table</a></li>
                    </ul>
                </li>
                <li class="animate9 fadeInUp"><a href="typography.html"><span class="icon-font"></span> Typography</a></li>*@
                <li class="animate10 fadeInUp"><a href="chart"><span class="icon-signal"></span> Graph &amp; Charts</a></li>
                @*<li class="animate11 fadeInUp"><a href="messages.html"><span class="icon-envelope"></span> Messages</a></li>
                <li class="animate12 fadeInUp"><a href="buttons.html"><span class="icon-hand-up"></span> Buttons &amp; Icons</a></li>
                <li class="dropdown animate13 fadeInUp"><a href=""><span class="icon-pencil"></span> Forms</a>
                	<ul>
                    	<li><a href="forms.html">Form Styles</a></li>
                        <li><a href="wizards.html">Wizard Form</a></li>
                        <li><a href="wysiwyg.html">WYSIWYG</a></li>
                    </ul>
                </li>
                <li class="animate14 fadeInUp"><a href="calendar.html"><span class="icon-calendar"></span> Calendar</a></li>
                <li class="animate15 fadeInUp"><a href="animations.html"><span class="icon-play"></span> Animations</a></li>
                <li class="dropdown animate16 fadeInUp"><a href=""><span class="icon-book"></span> Other Pages</a>
                	<ul>
                    	<li><a href="404.html">404 Error Page</a></li>
                        <li><a href="invoice.html">Invoice Page</a></li>
                        <li><a href="editprofile.html">Edit Profile</a></li>
                        <li><a href="grid.html">Grid Styles</a></li>
                    </ul>
                </li>*@
            </ul>
        </div><!--leftmenu-->
        
    </div><!--mainleft-->
    <!-- END OF LEFT PANEL -->
    
    <!-- START OF RIGHT PANEL -->
    <div class="rightpanel" style="margin-left: 260px;">
    	<div class="headerpanel animate1 fadeInUp">
        	<a class="showmenu" href=""></a>
            
            <div class="headerright">
            	<div class="dropdown notification">
                    <a href="/page.html" data-target="#" data-toggle="dropdown" class="dropdown-toggle">
                    	<span class="iconsweets-globe iconsweets-white"></span>
                    </a>
                    <ul class="dropdown-menu">
                    	<li class="nav-header">Notifications</li>
                        <li>
                        	<a href="">
                        	<strong>3 people viewed your profile</strong><br>
                            <img alt="" src="/img/thumbs/thumb1.png">
                            <img alt="" src="/img/thumbs/thumb2.png">
                            <img alt="" src="/img/thumbs/thumb3.png">
                            </a>
                        </li>
                        <li><a href=""><span class="icon-envelope"></span> New message from <strong>Jack</strong> <small class="muted"> - 19 hours ago</small></a></li>
                        <li><a href=""><span class="icon-envelope"></span> New message from <strong>Daniel</strong> <small class="muted"> - 2 days ago</small></a></li>
                        <li><a href=""><span class="icon-user"></span> <strong>Bruce</strong> is now following you <small class="muted"> - 2 days ago</small></a></li>
                        <li class="viewmore"><a href="">View More Notifications</a></li>
                    </ul>
                </div><!--dropdown-->
                
    			<div class="dropdown userinfo">
                    <a href="/page.html" data-target="#" data-toggle="dropdown" class="dropdown-toggle">Hi, ThemePixels! <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li><a href="editprofile.html"><span class="icon-edit"></span> Edit Profile</a></li>
                        <li><a href=""><span class="icon-wrench"></span> Account Settings</a></li>
                        <li><a href=""><span class="icon-eye-open"></span> Privacy Settings</a></li>
                        <li class="divider"></li>
                        <li><a href="index.html"><span class="icon-off"></span> Sign Out</a></li>
                    </ul>
                </div><!--dropdown-->
    		
            </div><!--headerright-->
            
    	</div><!--headerpanel-->
        <div class="breadcrumbwidget animate2 fadeInUp">
        	<ul class="skins">
                <li><a class="skin-color default" href="default"></a></li>
                <li><a class="skin-color orange" href="orange"></a></li>
                <li><a class="skin-color dark" href="dark"></a></li>
                <li>&nbsp;</li>
                <li class="fixed"><a class="skin-layout fixed" href=""></a></li>
                <li class="wide"><a class="skin-layout wide" href=""></a></li>
            </ul><!--skins-->
        	<ul class="breadcrumb">
                <li><a href="dashboard.html">Home</a> <span class="divider">/</span></li>
                <li class="active">KSS Form</li>
                
            </ul>
        </div><!--breadcrumbwidget-->
      <div class="pagetitle animate3 fadeInUp">
        	<h1>KSS Form</h1> <span>This is a sample description for KSS form page...</span>
        </div><!--pagetitle-->
        
        <div class="maincontent animate4 fadeInUp">
        	<div class="contentinner content-dashboard">
            	<div class="alert alert-info">
                	<button data-dismiss="alert" class="close" type="button">×</button>
                    <strong>Welcome!</strong> This alert needs your attention, but it's not super important.
                </div><!--alert-->
                
                <div class="row-fluid">
                	 @RenderSection("featured", required: false)
               
                    @RenderBody()
               
                </div><!--row-fluid-->
            </div><!--contentinner-->
        </div><!--maincontent-->
        
    </div><!--mainright-->
    <!-- END OF RIGHT PANEL -->
    
    <div class="clearfix"></div>
    
    <div class="footer">
    	<div class="footerleft" style="display: block;">Reddot Digital Co.,Ltd.</div>
    	<div class="footerright " style="margin-left: 260px; color:red;">Error Message</div>
    </div><!--footer-->

   <script type="text/javascript">
    jQuery(document).ready(function () {
								
        // basic chart
        var flash = [[0, 2], [1, 6], [2,3], [3, 8], [4, 5], [5, 13], [6, 8]];
        var html5 = [[0, 5], [1, 4], [2,4], [3, 1], [4, 9], [5, 10], [6, 13]];
			
        function showTooltip(x, y, contents) {
            jQuery('&lt;div id="tooltip" class="tooltipflot"&gt;' + contents + '&lt;/div&gt;').css( {
                position: 'absolute',
                display: 'none',
                top: y + 5,
                left: x + 5
            }).appendTo("body").fadeIn(200);
        }
	
			
        //var plot = jQuery.plot(jQuery("#chartplace2"),
		//	   [ { data: flash, label: "Flash(x)", color: "#fb6409"}, { data: html5, label: "HTML5(x)", color: "#096afb"} ], {
		//	       series: {
		//	           lines: { show: true, fill: true, fillColor: { colors: [ { opacity: 0.05 }, { opacity: 0.15 } ] } },
		//	           points: { show: true }
		//	       },
		//	       legend: { position: 'nw'},
		//	       grid: { hoverable: true, clickable: true, borderColor: '#ccc', borderWidth: 1, labelMargin: 10 },
		//	       yaxis: { min: 0, max: 15 }
		//	   });
		
        //var previousPoint = null;
        //jQuery("#chartplace2").bind("plothover", function (event, pos, item) {
        //    jQuery("#x").text(pos.x.toFixed(2));
        //    jQuery("#y").text(pos.y.toFixed(2));
			
        //    if(item) {
        //        if (previousPoint != item.dataIndex) {
        //            previousPoint = item.dataIndex;
						
        //            jQuery("#tooltip").remove();
        //            var x = item.datapoint[0].toFixed(2),
		//			y = item.datapoint[1].toFixed(2);
						
        //            showTooltip(item.pageX, item.pageY,
		//							item.series.label + " of " + x + " = " + y);
        //        }
			
        //    } else {
        //        jQuery("#tooltip").remove();
        //        previousPoint = null;            
        //    }
		
        //});
		
        //jQuery("#chartplace2").bind("plotclick", function (event, pos, item) {
        //    if (item) {
        //        jQuery("#clickdata").text("You clicked point " + item.dataIndex + " in " + item.series.label + ".");
        //        plot.highlight(item.series, item.datapoint);
        //    }
        //});


        //// bar graph
        //var d2 = [];
        //for (var i = 0; i &lt;= 10; i += 1)
        //d2.push([i, parseInt(Math.random() * 30)]);
			
        //var stack = 0, bars = true, lines = false, steps = false;
        //jQuery.plot(jQuery("#bargraph2"), [ d2 ], {
        //    series: {
        //        stack: stack,
        //        lines: { show: lines, fill: true, steps: steps },
        //        bars: { show: bars, barWidth: 0.6 }
        //    },
        //    grid: { hoverable: true, clickable: true, borderColor: '#bbb', borderWidth: 1, labelMargin: 10 },
        //    colors: ["#06c"]
        //});
		
        // calendar
        jQuery('#calendar').datepicker();


    });
</script> 
</div>
    @RenderSection("scripts", required: false)
</body>
</html>
